<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<script type="text/javascript"
	src="<c:url value="jquery-1.7.2.min.js" />"></script>
<script type="text/javascript"
	src="<c:url value="jquery.validate.min.js" />"></script>

<style type="text/css">
#tuiterrr {
	background-color: #D0DCDA;
	border-color: 1px;
}

#textTuiter {
	width: 400px;
}

#data {
	font-size: 13px;
}

#mensa {
	font-style: oblique;
}

#resp {
	background-color: #FAEBD7;
}
#tutu{
	float: left;
}
#usuarios{
	width: 200px;
	float: left;
}
</style>

<script type="text/javascript">
	jQuery(document)
			.ready(
					function() {
						$('#tuiterForm')
								.validate(
										{
											rules : {
												"tuitter" : {
													required : true,
													maxlength : 140
												},

											},
											messages : {
												"tuitter" : {
													required : "Texto Obrigatório",
													maxlength : "Seu Tu'iter deve conter, no maximo, 140 caracteres"
												},
											}
										});
					});
</script>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Bem Vindo</title>
</head>
<body style="background-color: #DCDCDC">

	<h2 align="center">Tu'iter xD</h2>

	<form action="/Twitter/deslogarServlet" method="post">
		<a>Bem Vindo ${dados.nome}</a> <input type="submit" value="Sair" />
	</form>

	<form action="/Twitter/listTwitterServlet">
		<input type="hidden" name="idUsuario" value="${dados.nick}" />
		<input type="submit" value="Inicio" />
	</form>
	
	<form id="tuiterForm" action="/Twitter/twittaServlet">
		<input type="hidden" name="idUsuario" value="${dados.nick}" />
		<input id="textTuiter" type="text" maxlength="140" name="tuitter" />
		<input type="submit" value="Tuitar" />
	</form>

	<table id="usuarios" >
		<thead>
			<tr>
				<th>Usuários</th>
				<th> </th>
			</tr>
		</thead>
		<tbody>
			<c:forEach items="${user}" var="u">
				<tr>
					<td>${u.nick}</td>
					<td>
						<form action="/Twitter/listTwitterUserServlet">
							<input type="hidden" name="idNick" value="${u.id}"/>
							<input type="hidden" name="nick" value="${u.nick}"/>
							<input type="submit" name="verUsuario" value="Ver Tu'iters" />
						</form>
					</td>
				</tr>
			</c:forEach>
		</tbody>
	</table>
	
	<ul id="tutu">
		<c:forEach items="${tuit}" var="t">
			<li id="tuiterrr">${t.idUsuario} diz:<br />

				<div id="mensa">${t.mensagem}</div>

				<div id="resp">
					${t.resposta}<br />
				</div> 
					<a id="data">Data: <fmt:formatDate value="${t.dataHora}"
					pattern="dd/MM/yyyy" /> - ${t.hora}	</a><br />

				<form id="responder" action="/Twitter/respostaTwittaServlet"
					method="post">
					<input type="hidden" name="nick" value="${dados.nick}" />
					<input type="hidden" name="idTuiter" value="${t.id}" />
					<input type="text" name="respTuitter" maxlength="140" />
					<input type="submit" name="responder" value="Responder" />
				</form>

				<form id="reTuitar" action="/Twitter/reTwittaServlet" method="post">
					<input type="hidden" name="nickUsuario" value="${t.idUsuario}" />
					<input type="hidden" name="tuitter" value="${t.mensagem}" />
					<input type="hidden" name="nickSession" value="${dados.nick}" />
					<input type="submit" name="responder" value="ReTuitar" />
				</form>

			</li>
			<br />
		</c:forEach>
	</ul>

</body>
</html>